<template>
  <el-select :valueKey="valueKey" class="z-select" :placeholder="$t(placeholder)">
    <t-option
      :list="items"
      v-bind="props"
      :valueKey="valueKey"
      :i18n="i18n"
      :i18n-prefix="i18nPrefix"
    ></t-option>
  </el-select>
</template>

<script lang="ts" setup>
import tOption from './option.vue'
import { useI18n } from 'vue-i18n'

const PROPS = defineProps<{
  items?: AnyObject[]
  props?: AnyObject
  valueKey?: string
  i18n?: boolean
  i18nPrefix?: string
  placeholder?: string
}>()

const { t } = useI18n()
const $t = (text?: string) => {
  return PROPS.i18n && text ? t((PROPS.i18nPrefix ? PROPS.i18nPrefix + '.' : '') + text) : text
}
</script>

<style lang="scss">
.z-select {
  min-width: var(--z-input-min-width);
}
</style>
